﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
<title>Template Test</title>
<link rel="stylesheet" href="../../resources/test.css" type="text/css" />
<script>
<!--
    var ar = [];
    var VERSION       = location.href.match(/version=([\d\.]+)/) ? '-'+RegExp.$1 : '';
    var PROTOTYPE     = '../../lib/prototype.js';
    var UNIT_TEST     = '../../lib/unittest.js';
    var SRC_DIRECTORY = '../../src/';
    var TARGET_CODES  = [
        'event_wrapper.js',
        'html/template'+VERSION+'.js'
    ];
    /*etInterval(function(){
        ar.push((new Date).getTime());
    },10);*/
    document.writeln('<script src=\"'+ PROTOTYPE +'\"><\/script>');
    document.writeln('<script src=\"'+ UNIT_TEST +'\"><\/script>');
    for(var i = 0 ,T , l = TARGET_CODES.length;i<l; i++){
        T = SRC_DIRECTORY + TARGET_CODES[i];
        document.writeln('<script src=\"'+ T +'\"><\/script>');
    }

-->
</script>

</head>
<body>
<div id="testlog"></div>
<div id="urltest"></div>

<div id="field"></div>
<div id="field_update"></div>
<div id="field_update_render"></div>
<div id="field_insert"></div>
<div id="field_insert_render"></div>


<div id="wrapper">
<div id="_dummy">
<h1>Test 2</h1>
<p>
Case-1</p><div>xx</div>
Case-1<div>xx</div>
Case-1<div>xx</div>
Case-1<div>xx</div>
<p></p>
</div>
<div id="_dummy2">
<h1>Test 2</h1>
<p>
Case-1</p><div>xx</div>
Case-1<div>xx</div>
Case-1<div>xx</div>
Case-1<div>xx</div>
<p></p>
</div>
</div>
<input type=button value='compile' onclick="window.hoge=new HTML.Template(COMPLEX_TMPL+'helo')">
<input type=button value='output' onclick="window.hoge.output()">

<div id="test01_tmpl" class="HTML_TEMPLATE"><!--<TMPL_LOOP NAME="loop"><TMPL_VAR NAME="test"></TMPL_LOOP>*--></div>
<div id="test02_tmpl" class="HTML_TEMPLATE"><!--hello<TMPL_LOOP NAME='outer'><TMPL_INCLUDE NAME='dom:test01_tmpl'></TMPL_LOOP>hello--></div>
<div id="test03_tmpl" ><!--<TMPL_LOOP NAME="loop"><TMPL_VAR NAME="test"></TMPL_LOOP>*--></div>
<div id="test04_tmpl" class="HTML_TEMPLATE"></div>
</body>
<script language="javascript" type="text/javascript">
<!--
(function(){
    var Aspect = {
        weave:function(dst,src){
            $H(src).each(function(e){
                var key = e[0],value = e[1];
                if( Object.isFunction(value) && 
                    Object.isFunction(dst[key]) ){
                    dst[key]=dst[key].wrap(value);
                }
            });
        }
    };
    var logger = function(name,proceed){
        var args = $A(arguments);
        args.shift();args.shift();
        console.log(args);
        var ret=proceed.apply(this,args);
        console.log(name+':'+this.storedName+":"+ret);
        return ret;
    };
    Aspect.weave(HTML.Template.prototype,{
        // 出力結果を見たい関数を記述
        //output:logger.curry('output'),
        //param:logger.curry('param')
    });
})();


var COMPLEX_TMPL =[
    '<h1>Test <TMPL_VAR NAME=name></h1>',
    '<p>',
    '<TMPL_LOOP NAME=loop>',
    '<TMPL_IF NAME=case1>',
    'Case-1<div>xx</div>',
    '<TMPL_ELSE>',
    '<TMPL_IF NAME=case2>',
    'Case-2<div>xx</div>',
    '<TMPL_ELSE>',
    '<TMPL_IF NAME=case3>',
    'Case-3<div>xx</div>',
    '<TMPL_ELSE>',
    'Other cases<div>xx</div>',
    '</TMPL_IF>',
    '</TMPL_IF>',
    '</TMPL_IF>',
    '</TMPL_LOOP>',
    '<img src="../../resources/test.jpg">',
    '</p>'
].join('\n');

document.observe('dom:loaded',function(){

new Test.Unit.Runner({
    testNamespace:function(){with(this){
        assert(HTML.Template                ,'HTML.Template');
        assert(HTML.Template.Element        ,'HTML.Template.Element');
        assert(HTML.Template.ROOTElement    ,'HTML.Template.ROOTElement');
        assert(HTML.Template.LOOPElement    ,'HTML.Template.LOOPElement');
        assert(HTML.Template.IFElement      ,'HTML.Template.IFElement');
        assert(HTML.Template.ELSEElement    ,'HTML.Template.ELSEElement');
        assert(HTML.Template.ELSIFElement   ,'HTML.Template.ELSIFElement');
        assert(HTML.Template.VARElement     ,'HTML.Template.VARElement');
        assert(HTML.Template.TEXTElement    ,'HTML.Template.TEXTElement');
        assert(HTML.Template.UNLESSElement  ,'HTML.Template.UNLESSElement');
    }},
    testVAR:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_VAR NAME=test1><TMPL_VAR NAME=test2><TMPL_VAR NAME=test3>'});
        x.param({test1:1,test2:2,test3:3});
        assertEqual(x.output(),'123');
        x = new HTML.Template({type:'text',source:':<TMPL_VAR NAME=test1>:<TMPL_VAR NAME=test2>:<TMPL_VAR NAME=test3>:'});
        x.param({test1:1,test2:2,test3:3});
        assertEqual(x.output(),':1:2:3:');
        x = new HTML.Template({type:'text',source:'\n:<TMPL_VAR NAME=test1>:<TMPL_VAR NAME=test2>:<TMPL_VAR NAME=test3>:\n'});
        x.param({test1:1,test2:2,test3:3});
        assertEqual(x.output(),'\n:1:2:3:\n');
        
        x = new HTML.Template({type:'text',source:'<TMPL_VAR NAME=test>:'});
        x.param({});
        assertEqual(x.output(),':');
    }},
    testIF:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_IF NAME=test>hogehoge</TMPL_IF>'});
        x.param({test:1});
        assertEqual(x.output(),'hogehoge');
        x.param({test:0});
        assertEqual(x.output(),'');
        x.param({});
        assertEqual(x.output(),'');
    }},
    testELSE:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_IF NAME=test>いいいい<TMPL_ELSE>ああああ</TMPL_IF>'});
        x.param({test:1});
        assertEqual(x.output(),'いいいい');
        x.param({test:0});
        assertEqual(x.output(),'ああああ');
        var x = new HTML.Template({type:'text',source:'<TMPL_IF NAME=test>いいいい<TMPL_ELSE><TMPL_IF NAME=test2>ぬぬぬ<TMPL_ELSE>おおお</TMPL_IF></TMPL_IF>'});
        x.param({test:0,test2:true});
        assertEqual(x.output(),'ぬぬぬ');
        x.param({test:0,test2:false});
        assertEqual(x.output(),'おおお');
    }},
    testUNLESS:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_UNLESS NAME=test>いいいい<TMPL_ELSE>ああああ</TMPL_UNLESS>'});
        x.param({test:1});
        assertEqual(x.output(),'ああああ');
        x.param({test:0});
        assertEqual(x.output(),'いいいい');
        
        var x = new HTML.Template({type:'text',source:'<TMPL_UNLESS NAME=test>いいい<TMPL_ELSE><TMPL_UNLESS NAME=test2>ぬぬぬ<TMPL_ELSE>おおお</TMPL_UNLESS></TMPL_UNLESS>'});
        x.param({test:0,test2:true});
        assertEqual(x.output(),'いいい');
        x.param({test:1,test2:false});
        assertEqual(x.output(),'ぬぬぬ');
    }},
    testLOOP:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_LOOP NAME=test>あ</TMPL_LOOP>'});
        x.param({test:[1,2,3,4,5]});
        assertEqual(x.output(),'あああああ');
        var y = new HTML.Template({type:'text',source:'<TMPL_LOOP NAME=test>あ</TMPL_LOOP>'});
        y.param({test1:[1,2,3,4,5]});
        assertEqual(y.output(),'');
        
        var z = new HTML.Template({
            type:'text',
            source:'<TMPL_LOOP NAME=level1><TMPL_VAR NAME=var1><TMPL_LOOP NAME=level2><TMPL_VAR NAME=var2></TMPL_LOOP></TMPL_LOOP>'});
        z.param({
            level1:[
                {var1:'hello',level2:[{var2:'world'}]},
                {var1:'hello2',level2:[{var2:'world1'},{var2:'world2'}]}
            ]
        });
        assertEqual(z.output(),'helloworldhello2world1world2');
    }}
    ,testINCLUDE:function(){with(this){
        var tmpl=new HTML.Template('dom:test02_tmpl');
        tmpl.param({
        outer:[
            {loop:[
                {test:1},
                {test:2},
                {test:3},
            ]},
            {loop:[
                {test:1},
                {test:2},
                {test:3},
            ]}
        ]
        });
        assertEqual('hello123*123*hello',tmpl.output());

    }},
    testURL:function(){with(this){
        
        document.observe('htmltemplate:compiled',function(evt){
            //console.log('htmltemplate_compiled:'+this.storedName);
        }.bind(new HTML.Template('url:../../tmpl/test.tmpl')));

    }},
    testDEFAULT:function(){with(this){
        var tmpl=new HTML.Template('<TMPL_VAR NAME="aaa" DEFAULT="a">');
        assertEqual('a',tmpl.output());
        var tmplB=new HTML.Template('<TMPL_VAR  DEFAULT="a" NAME="aaa">');
        assertEqual('a',tmplB.output());
    }},
    testESCAPE:function(){with(this){
        var tmpl=new HTML.Template('<TMPL_VAR NAME="aaa" ESCAPE=HTML>');
        tmpl.param({
        	aaa:"<div>hoge</div>"
        });
        assertEqual('&lt;div&gt;hoge&lt;/div&gt;',tmpl.output());
        var tmpl=new HTML.Template('<TMPL_VAR NAME="aaa" ESCAPE=JS>');
        tmpl.param({
        	aaa:"aaa\n\n"
        });
        assertEqual('"aaa\\n\\n"',tmpl.output());
        var tmpl=new HTML.Template('<TMPL_VAR NAME="aaa" ESCAPE=URL>');
        tmpl.param({
        	aaa:"http://www.js/ ほげ"
        });
        assertEqual('http://www.js/%20%E3%81%BB%E3%81%92',tmpl.output());
    }},
    testEXPR:function(){with(this){
        var x = new HTML.Template({type:'text',source:'<TMPL_VAR EXPR="func(test)">'});
        x.param({
            test:'hogehoge'
        });
        x.registerFunction('func',function(t){return t+'::::'});
        assertEqual(x.output(),'hogehoge::::');
        
        HTML.Template.registerFunction('moremore',function(){
            return 'HELP!';
        });
        var x = new HTML.Template({type:'text',source:'<TMPL_VAR EXPR="moremore()">'});

        assertEqual(x.output(),'HELP!');
        
        var x = new HTML.Template({type:'text',source:'<TMPL_LOOP EXPR="func(test)">i</TMPL_LOOP>'});
        x.registerFunction('func',function(t){return [t,t,t,t,t,t,t,t,t,t]});
        x.param({
            test:10
        });
        assertEqual(x.output(),'iiiiiiiiii');
        
        var y = new HTML.Template({type:'text',source:'<TMPL_IF EXPR="func(test)">i<TMPL_ELSIF EXPR="test">love</TMPL_IF>'});
        y.registerFunction('func',function(t){return !t;});
        y.param({
            test:false
        });
        assertEqual(y.output(),'i');
            
        y.param({
            test:true
        });
        assertEqual(y.output(),'love');
        var z = new HTML.Template({type:'text',source:'<TMPL_UNLESS EXPR="func(test)">love</TMPL_UNLESS>'});
        z.param({
            test:true
        });
        z.registerFunction('func',function(t){return !t;});
        assertEqual(z.output(),'love');
        
        
    }},
    testExtra:function(){with(this){
        var test01=new HTML.Template('dom:test01_tmpl');
        test01.param({
            loop:[
                {test:1},
                {test:2},
                {test:3}
            ]
        });
        assertEqual("123*",test01.output());
        var func = test01.functionize();
        assertEqual("123*",func({
            loop:[
                {test:1},
                {test:2},
                {test:3}
            ]
        }));
        var test03 = new HTML.Template('dom:test03_tmpl');
        test03.param({
            loop:[
                {test:1},
                {test:2},
                {test:3}
            ]
        });
        assertEqual(test03.output(),'123*');
        
        var test04 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR NAME="a"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test04.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ]}
                ]}
            ]
        });
        assertEqual('hoge',test04.output());
        var test05 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR NAME="/a"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test05.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ]}
                ]}
            ],
            a :'huga'
        });
        assertEqual('huga',test05.output());
        var test06 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR NAME="../a"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test06.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ],a:'piyo'}
                ],a:'moga'}
            ],
            a :'huga'
        });
        assertEqual('piyo',test06.output());
        var test07 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR NAME="../../a"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test07.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ],a:'piyo'}
                ],a:'moga'}
            ],
            a :'huga'
        });
        assertEqual('moga',test07.output());
            
    }},
    testEXEXPR:function(){with(this){
        var test04 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR EXPR="a"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test04.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ]}
                ]}
            ]
        });
        assertEqual('hoge',test04.output());
        var test05 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR EXPR="{/a}"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test05.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ]}
                ]}
            ],
            a :'huga'
        });
        assertEqual('huga',test05.output());
        var test06 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR EXPR="{../a}"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test06.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ],a:'piyo'}
                ],a:'moga'}
            ],
            a :'huga'
        });
        assertEqual('piyo',test06.output());
        var test07 = new HTML.Template('<TMPL_LOOP NAME=aaa><TMPL_LOOP NAME=bbb><TMPL_LOOP NAME=ccc><TMPL_VAR EXPR="{../../a}"></TMPL_LOOP></TMPL_LOOP></TMPL_LOOP>');
        test07.param({
            aaa :[
                {bbb:[
                    {ccc:[
                        {a:'hoge'}
                    ],a:'piyo'}
                ],a:'moga'}
            ],
            a :'huga'
        });
        assertEqual('moga',test07.output());

    }},
    testRender:function(){with(this){

        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            name:"render",
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        tmpl.render();
        $('field').update(tmpl);
        $('field').insert(tmpl);
        $('field').replace(tmpl);
    }},
    /*testBenchCompile:function(){with(this){
        benchmark(function(){
            new HTML.Template({type:'text',source:COMPLEX_TMPL+Math.random()});
        },100);
    }},*/
    testBenchOutput:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        benchmark(function(){
            tmpl.output();
        },1000);
    }},
    testBenchHashFunction:function(){with(this){
        benchmark(function(){
            HTML.Template.hashFunction(COMPLEX_TMPL);
        },100);
    }},
    testBenchInnerHTML:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        tmpl.render();
        var f = $('field_update_render');
        benchmark(function(){
            f.innerHTML = tmpl.output();
        },100);
    }},
    testBenchUpdate:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        var f = $('field_update');
        benchmark(function(){
            f.update(tmpl);
        },100);
    }},
    testBenchPrerenderUpdate:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        tmpl.render();
        var f = $('field_update_render');
        benchmark(function(){
            f.update(tmpl);
        },100);
    }},
    testBenchInsert:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        var f = $('field_insert');
        benchmark(function(){
            f.insert(tmpl);
        },100);
    }},
    testBenchPrerenderInsert:function(){with(this){
        var tmpl = new HTML.Template({type:'text',source:COMPLEX_TMPL});
        tmpl.param({
            loop:[
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false},
                {case1:true,case2:true,case3:false}
            ]
        });
        tmpl.render();
        var f = $('field_insert_render');
        benchmark(function(){
            f.insert(tmpl);
        },100);
    }},
    testBenchExpr:function(){with(this){
        var tmpl = new HTML.Template({
            type   :'text',
            source :'<TMPL_VAR EXPR="addValue(x,10)"><TMPL_VAR EXPR="addValue(x,20)">'
        });
        tmpl.registerFunction('addValue',function(a,b){return a+b});
        benchmark(function(){
            tmpl.param({
                x:100
            });
            tmpl.output();
        },1000);
    }}

});
});

-->
</script>
</html>
